<%@ page import="java.util.Random" %>
<%--
  Created by IntelliJ IDEA.
  User: ghostxbh
  Date: 2020/7/24
  Time: 11:52 上午
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ include file="/webpage/include/taglib.jsp" %>
<html>
<head>
    <script type="text/javascript" async="" charset="utf-8"
            src="http://c.cnzz.com/core.php?web_id=30065558&amp;t=q"></script>
    <script type="text/javascript" async="" charset="utf-8"
            src="http://w.cnzz.com/c.php?id=30065558&amp;async=1"></script>
    <title>${note.title}</title>
    <%@include file="/webpage/include/front.jsp" %>
    <script type="text/javascript">
        window.Env = {
            "mddid": 10403,
            "curr_page": 1,
            "music_url": null,
            "author_uid": "30896510",
            "author_name": "\u6484\u5b81",
            "logo_120": "http:\/\/b1-q.mafengwo.net\/s15\/M00\/F1\/1B\/CoUBGV3BkxyAAq-MAACUoDMCrPI34.jpeg?imageMogr2%2Fthumbnail%2F%21120x120r%2Fgravity%2FCenter%2Fcrop%2F%21120x120%2Fquality%2F90",
            "is_new_note": true,
            "iid": 21115699,
            "new_iid": "1137595888",
            "showToolbarQrcode": true,
            "has_more": true,
            "__ctk__": "0dec3b8528a67e0e38f2ce65d907adff_5f994a06456323488c21eb5d0a78b8fc",
            "pv_workkey": "5f1967db-aef2-b97f-5f86-578061901133-5fa569afa08b5-21115699",
            "pv_worktask": "78822298,bfcd,6e34,5aa8,60bf,57b3,1672,bffa,c507,7fa5,cbcd,92a3,0cb0,3da7,b5b4,b4c4,e3b1",
            "WWW_HOST": "www.mafengwo.cn",
            "IMG_HOST": "images.mafengwo.net",
            "W_HTTP": "http:\/\/w.mafengwo.cn",
            "P_HOST": "passport.mafengwo.cn",
            "P_HTTP": "https:\/\/passport.mafengwo.cn",
            "PAGELET_HTTP": "http:\/\/pagelet.mafengwo.cn",
            "JS_HOST": "js.mafengwo.net",
            "TONGJI_HOST": "tongji.mafengwo.cn",
            "UID": 0,
            "CSTK": "0dec3b8528a67e0e38f2ce65d907adff_5f994a06456323488c21eb5d0a78b8fc",
            "GOOGLE_MAP_KEY": "AIzaSyD-Su0x_rPy1xehlMBcMyTqWkU49Bk53nQ"
        };
    </script>
    <link href="${ctxStatic}/common/css/1578479974.css" rel="stylesheet" type="text/css"/>
    <link href="${ctxStatic}/common/css/1569822623.css" rel="stylesheet" type="text/css"/>
    <link href="${ctxStatic}/common/css/smart_guide_u120.css"/>
    <script type="text/javascript" src="${ctxStatic}/common/js/1542357400.js"></script>
    <script type="text/javascript" src="${ctxStatic}/common/js/hls.min.js"></script>
    <style type="text/css">._j_fix_block_abs_3 {
        position: absolute;
        bottom: 0px;
        height: 926px
    }</style>
    <style type="text/css">._j_fix_block_abs_4 {
        position: absolute;
        bottom: 0px;
        height: 675px
    }</style>
    <style type="text/css">._j_fix_block_abs_5 {
        position: absolute;
        bottom: 0px;
        height: 300px
    }</style>
</head>
<body style="position: relative;">
<%@ include file="/webpage/include/header.jsp" %>
<%@include file="/webpage/include/summernote.jsp" %>
<div class="main">
    <div class="set_index" id="_j_cover_box" style="height: 560px;">
        <div class="set_bg _j_load_cover" style="z-index: 1; background-image: url(${note.advertUrl}); opacity: 1;">
            <img src="${note.advertUrl}" style="display: none">
        </div>

        <div class="fully_loading" style="display: none;">
            <p vtip="头图加载中...">头图加载中...</p>
            <img src="${ctxStatic}/common/images/fully_loading_v2.gif" alt="loading">
        </div>

        <div class="_j_titlebg">
            <div class="title_bg"></div>
            <div class="view_info" data-length="28">
                <div class="vi_con">
                    <h1 data-length="28" class="headtext lh80"
                        style="white-space: nowrap; overflow-wrap: normal;">${note.title}</h1>
                </div>
            </div>
        </div>
    </div>
    <script>$('#_j_cover_box').height($(window).width() / 3);</script>


    <div class="view_title clearfix">
        <div id="pagelet-block-0a311b12f7e06aadc62c5a7e0bbe9625" class="pagelet-block"
             data-api=":note:pagelet:headOperateApi" data-params="{&quot;iid&quot;:&quot;21115699&quot;}" data-async="1"
             data-controller="/js/note/ControllerHead">
            <div class="vt_center">
                <%--<div class="ding _j_ding_father">
                    <a onclick="addLike(`${note.id}`)" title="赞">赞</a>
                    <div class="num _j_up_num topvote21115699">${note.likeCount}</div>
                </div>--%>
                <div class="person" data-cs-t="ginfo_person_operate">
                    <a href="${ctxFront}/u/author?id=${note.createBy.id}" target="_blank" class="per_pic">
                        <img width="120" height="120" src="${note.createBy.photo}" alt="${note.createBy.name}"/>
                    </a>
                    <strong><a href="${ctxFront}/u/author?id=${note.createBy.id}" target="_blank" class="per_name"
                               title="${note.createBy.name}">${note.createBy.name}</a></strong>
                    <a href="${ctxFront}/u/author?id=${note.createBy.id}" target="_blank" class="per_grade">LV.
                        <%
                            Random a = new Random();
                            out.print(a.nextInt(30) + 1);
                        %>
                    </a>
                    <%--<a onclick="addFollow(`${note.createBy.id}`)">
                        <img src="${ctxStatic}/common/images/btn_sfollow.gif" width="38" height="13" border="0"
                             title="关注TA">
                    </a>--%>
                    <div class="vc_time">
                        <span class="time">发布时间: <fmt:formatDate value="${note.createDate}"
                                                                 pattern="yyyy-MM-dd HH:mm:ss"/></span>
                        <span>阅读数: ${note.readCount}</span>
                    </div>
                </div>

                <%--<div class="bar_share _j_share_father _j_top_share_group">
                    <div class="bs_share">
                        <a href="javascript:void(0);" rel="nofollow" title="分享" class="bs_btn"><i></i><span>0</span><strong>分享</strong></a>
                        <div class="bs_pop clearfix" style="display: none;">
                            <a title="分享到新浪微博" rel="nofollow" role="button" class="sina" data-japp="sns_share" data-jappfedata="" data-key="wb" data-title="精彩游记---《穿越党岭葫芦海，攀登仙山夏羌拉 | 一起去追寻秋天的童话！》" data-content="#一场未知的旅行#[哈哈]我发现了一篇关于【丹巴】的#马蜂窝游记#----《穿越党岭葫芦海，攀登仙山夏羌拉 | 一起去追寻秋天的童话！》，35人【喜欢】。" data-pic="http://b1-q.mafengwo.net/s17/M00/19/B8/CoUBXl-hE3uAJooYABYtGDyl80o68.jpeg?imageView2%2F2%2Fw%2F600%2Fq%2F90%7CimageMogr2%2Fstrip%2Fquality%2F90|http://p1-q.mafengwo.net/s17/M00/1D/9E/CoUBXl-hFeeADC6aABSTjUiPAwE18.jpeg?imageView2%2F2%2Fw%2F600%2Fq%2F90%7CimageMogr2%2Fstrip%2Fquality%2F90|http://b1-q.mafengwo.net/s17/M00/1B/F4/CoUBXl-hFNeAHX6FABAb7B7abnY404.jpg?imageView2%2F2%2Fw%2F600%2Fq%2F90%7CimageMogr2%2Fstrip%2Fquality%2F90|http://b1-q.mafengwo.net/s17/M00/1F/B0/CoUBXl-hF0iAJwhiABVkCwL715E28.jpeg?imageView2%2F2%2Fw%2F600%2Fq%2F90%7CimageMogr2%2Fstrip%2Fquality%2F90" data-url="http://m.mafengwo.cn/i/21115699.html"></a>
                            <a title="分享到QQ空间" rel="nofollow" role="button" class="zone" data-japp="sns_share" data-jappfedata="" data-key="qz" data-title="精彩游记---《穿越党岭葫芦海，攀登仙山夏羌拉 | 一起去追寻秋天的童话！》" data-content="35人【喜欢】，" data-pic="http://b1-q.mafengwo.net/s17/M00/19/B8/CoUBXl-hE3uAJooYABYtGDyl80o68.jpeg?imageView2%2F2%2Fw%2F600%2Fq%2F90%7CimageMogr2%2Fstrip%2Fquality%2F90|http://p1-q.mafengwo.net/s17/M00/1D/9E/CoUBXl-hFeeADC6aABSTjUiPAwE18.jpeg?imageView2%2F2%2Fw%2F600%2Fq%2F90%7CimageMogr2%2Fstrip%2Fquality%2F90|http://b1-q.mafengwo.net/s17/M00/1B/F4/CoUBXl-hFNeAHX6FABAb7B7abnY404.jpg?imageView2%2F2%2Fw%2F600%2Fq%2F90%7CimageMogr2%2Fstrip%2Fquality%2F90|http://b1-q.mafengwo.net/s17/M00/1F/B0/CoUBXl-hF0iAJwhiABVkCwL715E28.jpeg?imageView2%2F2%2Fw%2F600%2Fq%2F90%7CimageMogr2%2Fstrip%2Fquality%2F90" data-url="http://m.mafengwo.cn/i/21115699.html"></a>
                            <a title="分享到微信" rel="nofollow" role="button" class="weixin" data-japp="weixin_dialog_share" data-jappfedata="" data-wx_qr="http://www.mafengwo.cn/qrcode.php?text=http%3A%2F%2Fm.mafengwo.cn%2Fi%2F21115699.html&amp;size=150&amp;eclevel=H&amp;logo=&amp;__stk__=08adee995fb1dce49dfb98bb11197270_e31f55b72ac6512be633461a82ee8271" data-detail="21115699"></a>
                        </div>
                    </div>
                    <div class="bs_collect ">
                        <a href="javascript:void(0);" rel="nofollow" title="收藏" class="bs_btn _j_do_fav" data-ctime="2020-11-05 15:14:54"><i></i><span>19</span><strong>收藏</strong></a>
                    </div>

                </div>--%>
                <div class="_j_music_father">

                </div>

            </div>
        </div>
    </div>

    <div class="view clearfix" style="position:relative;">
        <div class="view_con">
            <div class="activity_style_notes aNotice aNoticeM hide">
                <i class="asn_ico"></i>
                <strong class="noticeDes"></strong>
                <a href="http://www.mafengwo.cn/i/21115699.html" title="去看看" class="noticeUrl"
                   target="_blank">去看看&gt;</a>
                <a href="javascript:;" class="close noticeClose" title="不再显示">不再显示</a>
            </div>
            <div class="travel_directory _j_exscheduleinfo">
                <div class="tarvel_dir_list clearfix">
                    <ul>
                        <li class="time">目的地点<span>/</span>${note.city}<i></i></li>
                        <li class="time">出发时间<span>/</span>${note.travelTime}<i></i></li>
                        <li class="day">出行天数<span>/</span>${note.travelDay} 天</li>
                        <li class="people">人物<span>/</span>${note.personage}</li>
                        <li class="cost">人均费用<span>/</span>${note.percapita}RMB</li>
                    </ul>
                </div>
            </div>
            <div class="travel_directory _j_exscheduleinfo">
                <textarea type="text"  name="content" id="summernote" style="display: none"></textarea>
                <input type="hidden" id="article_content" value="${note.contents}">
            </div>
            <div class="vc_article">
                <div class="vc_total _j_help_total">
                    本篇游记共含<span> ${fn:length(note.contentsmd)} </span>个文字。帮助了<b class="_j_total_person" style="font-weight:inherit"> ${note.readCount} </b>名<b class="_j_total_mdd" style="font-weight:inherit"> ${note.city} </b>游客。
                </div>
            </div>

            <a name="replylist"></a>

            <div id="note-reply-bottomReplyApi" data-api=":note:pagelet:bottomReplyApi"
                 data-controller="/js/note/ControllerReply"
                 data-params="{&quot;iid&quot;:21115699,&quot;page&quot;:1}">

                <div class="mfw-cmt-wrap" id="_j_reply_list">
                    <ul>
                        <c:forEach items="${reviewList}" var="review" begin="0" varStatus="v">
                            <div class="mfw-cmt _j_reply_item" id="reply_126131305" data-rid="126131305" data-username="${review.reviewer.name}">
                                <div class="mcmt-info">
                                    <div class="mcmt-photo">
                                        <a href="${ctxFront}/u/author?id=${review.reviewer.id}" title="${review.reviewer.name}" target="_blank">
                                            <img src="${review.reviewer.photo}" width="48" height="48" alt="${review.reviewer.name}">
                                        </a>
                                    </div>
                                    <div class="mcmt-user">
                                        <a href="${ctxFront}/u/author?id=${review.reviewer.id}" target="_blank" class="name">${review.reviewer.name}(北京)</a>
                                        <a href="#" class="level">LV.
                                            <%
                                                Random b = new Random();
                                                out.print(b.nextInt(30) + 1);
                                            %>
                                        </a>
                                        <a href="javascript:void(0);" class="per_attention" data-japp="following" data-uid="74435282" data-follow_class="hide">
                                            <img src="http://images.mafengwo.net/images/home/tweet/btn_sfollow.gif" width="38" height="13" border="0" title="关注TA">
                                        </a>
                                    </div>
                                    <div class="mcmt-other">
                                        <span class="floor">${v.index}F</span>
                                    </div>
                                </div>
                                <div class="mcmt-con-wrap clearfix">
                                    <div class="mcmt-con">
                                        <div class="mcmt-word">
                                            <p class="_j_reply_content" data-content="${review.contents}">${review.contents}</p>
                                        </div>
                                    </div>
                                    <div class="mcmt-tag">
                                    </div>
                                </div>
                                <div class="mcmt-bot">
                                    <div class="time">
                                        <fmt:formatDate value="${review.createDate}"
                                                        pattern="yyyy-MM-dd HH:mm:ss"/></div>
                                    <div class="option">
                                    </div>
                                </div>
                            </div>
                        </c:forEach>
                    </ul>
                </div>
            </div>

        </div>


        <div class="view_side">
            <div class="relations _j_stas_content">


                <div id="pagelet-block-a5f13959185ba7fed78dd78a27f583bb" class="pagelet-block"
                     data-api=":note:pagelet:rightMddApi" data-params="{&quot;iid&quot;:&quot;21115699&quot;}"
                     data-async="1" data-controller="">
                    <div class="slide-right-container">
                        <div class="relation_mdd">相关目的地：
                            <a href="${ctxFront}/search?city=${note.city}" target="_blank"
                               title="甘孜" class="_j_mdd_stas">${note.city}</a>
                        </div>
                    </div>
                </div>
            </div>


            <div style="height: 983px; display: none;"></div>
            <div class="side_sticky _j_sticky_block">

                <div id="pagelet-block-8e0761685f0f46de37b2e43ce626ad02" class="pagelet-block"
                     data-api=":note:pagelet:relateNoteApi"
                     data-params="{&quot;iid&quot;:&quot;21115699&quot;,&quot;mddid&quot;:10403}" data-async="1"
                     data-controller="/js/note/ControllerRelate">
                    <div class="mainmdd_rel_notes _j_topblock" id="_j_mainmdd_rel_gls">
                        <div class="notes_gonglve" style="margin-bottom: 0">
                            <div class="side_title">相关攻略</div>
                            <div class="gonglve_slide gs1" id="_j_gl_slide_container">
                                <ul class="gs_content" style="left: 0px;">
                                    <c:forEach items="${cityNoteList}" var="n">
                                        <li>
                                            <a href="${ctxFront}/n/${n.code}.html" target="_blank"
                                               class="_j_mddrel_gl_item" data-id="9333953"
                                               title="${n.title}">
                                                <img src="${n.thumUrl}">
                                                <div class="bg"></div>
                                                <span><i></i>${n.readCount}</span>
                                                <h3>${n.title}</h3>
                                            </a>
                                        </li>
                                    </c:forEach>
                                </ul>
                            </div>
                        </div>

                    </div>
                </div>

                <div id="pagelet-block-3db3e97ff5c2fbcfe811b9b9ba33f271" class="pagelet-block"
                     data-api=":note:pagelet:recNoteApi" data-params="{&quot;iid&quot;:&quot;21115699&quot;}"
                     data-async="1" data-controller="/js/note/ControllerRec">
                    <div class="mainmdd_rel_notes _j_topblock" id="_j_mainmdd_rec_gls">
                        <div class="notes_gonglve" style="margin-bottom: 0">
                            <div class="side_title">相关游记</div>
                            <div class="gonglve_slide gs1" id="_j_rec_slide_container">
                                <ul class="gs_content" style="left: 0px;">
                                    <c:forEach items="${noteList}" var="n">
                                        <li>
                                            <a href="${ctxFront}/n/${n.code}.html" target="_blank"
                                               class="_j_mddrel_gl_item" data-id="9333953"
                                               title="${n.title}">
                                                <img src="${n.thumUrl}">
                                                <div class="bg"></div>
                                                <span><i></i>${n.readCount}</span>
                                                <h3>${n.title}</h3>
                                            </a>
                                        </li>
                                    </c:forEach>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

        </div>

    </div>

</div>


<style>
    #banner-con-gloable {
        display: block;
        position: fixed;
        bottom: 0;
        left: -100%;
        z-index: 110;
        width: 100%;
        height: 179px;
        overflow-x: hidden;
    }

    #banner-con-gloable .banner-btn-con {
        width: 100%;
        height: 162px;
        background: #0C151E;
        opacity: .8;
        position: absolute;
        bottom: 0;
    }

    #banner-con-gloable .banner-btn-con .close-btn {
        position: absolute;
        right: 35px;
        top: 24px;
        z-index: 120;
        height: 24px;
        width: 24px;
        cursor: pointer;
    }

    #banner-con-gloable .banner-image-con {
        position: absolute;
        right: 50%;
        bottom: 0;
        width: 1000px;
        margin-right: -500px;
    }

    #float-pannel-gloable {
        padding-left: 0;
        padding-bottom: 30px;
        display: block;
        position: fixed;
        bottom: 0;
        z-index: 110;
        left: -230px;
    }

    #float-pannel-gloable .float-btn {
        width: 24px;
        height: 24px;
        position: absolute;
        right: 0;
        top: 0;
        z-index: 100;
    }

    #closed {
        height: 24px;
        width: 24px;
        vertical-algin: top;
        border: none;
        cursor: pointer;
    }

    .mfw-toolbar {
        position: fixed;
        right: 50%;
        bottom: 20px;
        height: auto;
        margin-right: -558px;
        display: none;
        z-index: 10;
    }

    .mfw-toolbar .btn {
        width: 43px;
        height: 43px;
        display: block;
        border: 1px solid #e5e5e5;
        text-align: center;
        background-color: #fff;
        position: relative;
    }
</style>

<link href="./穿越党岭葫芦海，攀登仙山夏羌拉 _ 一起去追寻秋天的童话！,丹巴自助游攻略 - 马蜂窝_files/mfw-toolbar.css" rel="stylesheet" type="text/css">

<div class="mfw-toolbar" id="_j_mfwtoolbar" style="display: block;">
    <div class="toolbar-item-top" style="display: block;">
        <a role="button" class="btn _j_gotop">
            <i class="icon_top"></i>
            <em>返回顶部</em>
        </a>
    </div>
</div>
<script>
    $(function(){
        var innerhtml = $("#article_content").val();
        $("#summernote").val(innerhtml);
        $('#summernote').summernote('disable');
        $('#summernote').summernote('codeview.toggle');
    });

    function addLike(noteId) {
        $.ajax({
            method: 'GET',
            url: "/travel/f/n/like/" + noteId,
            data: {},
            success: function(res) {
                if (res.success) {
                    alert("已点赞");
                }
            }
        });
    }

    function addFollow(followId) {
        $.ajax({
            method: 'GET',
            url: "/travel/f/n/review/add?status=follow&followed=" + followId,
            data: {},
            success: function(res) {
                if (res.success) {
                    alert("已关注");
                } else {
                    if (res.msg==="loginFail"){
                        alert("未登录！");
                        window.location.href='${ctx}';
                    }
                }
            }
        });
    }
</script>

<script language="javascript" type="text/javascript">
    if (typeof M !== "undefined" && typeof M.loadResource === "function") {
        M.loadResource("http://js.mafengwo.net/js/cv/js+Dropdown:js+pageletcommon+pageHeadUserInfoWWWNormal:js+jquery.tmpl:js+M+module+InputListener:js+M+module+SuggestionXHR:js+M+module+DropList:js+M+module+Suggestion:js+M+module+MesSearchEvent:js+SiteSearch:js+AHeader:js+jquery.jplayer:js+M+module+TopTip:js+M+module+dialog+Layer:js+M+module+dialog+DialogBase:js+M+module+dialog+Dialog:js+M+module+dialog+alert:js+M+module+dialog+confirm:js+M+module+ScrollObserver:js+note+PagesCommunication:js+note+ControllerHead:js+home+NewerGuide:js+M+module+Slider:js+note+ControllerRelate:js+note+ControllerRec:js+note+ControllerCatalog:js+jquery.mousewheel.min:js+M+module+ScrollBar:js+M+module+StickyAndStayBlock:js+note+ASideSticky:js+note+ControllerExpand:js+M+module+Storage:js+M+module+ClickToggle:js+EmotionsHd:js+module+app+Page:js+M+module+FrequencyVerifyControl:js+M+module+FrequencyAppVerify:js+Selection:js+EmotionFastDelete:js+M+module+dialog+BindMobileAlert:js+note+GiveSign:js+note+GinfoReply:js+M+module+Caret:js+M+module+HoverTip:js+note+ControllerReply:js+purl:js+M+module+Movearound:js+note+ADetail:js+note+ADetailContent:js+jquery.upnum:js+note+ADetailImageBar:js+jquery.easing.1.3:js+M+module+Toggle:js+M+module+CopyrightProtecte:js+jquery.lazyload:js+common+TextSelectionTip:js+note+ACommon:js+note+anotice:js+note+poiofnote:js+M+module+RollNumbers:js+note+initHlsVideo:js+note+play.video:js+M+module+PowWorker:js+note+NotePoW:js+M+module+PageAdmin:js+M+module+Cookie:js+M+module+ResourceKeeper:js+jquery.jgrowl.min:js+AMessage:js+M+module+FrequencySystemVerify:js+ALogin:js+M+module+QRCode:js+AToolbar:js+ACnzzGaLog^YlBURQ^1602583826.js");
        M.loadResource("http://js.mafengwo.net/js/cv/js+ARecruit:js+ALazyLoad^YVE^1555469567.js");
    }
</script>


<div id="smartGuideFeng" style="bottom: 300px; display: block;">
    <div class="xiaofeng-hide"></div>
    <div class="sg-xiaofeng-hide-eye-l-v3" style="bottom: 82px; left: 6.00893px;"></div>
    <div class="sg-xiaofeng-hide-eye-r-v3" style="bottom: 38px; left: 6.34286px;"></div>
    <div class="sg-xiaofeng-hide-notice"></div>
</div>

<%@ include file="/webpage/include/footer.jsp" %>
</body>
</html>
